<#assign security=JspTaglibs["http://www.springframework.org/security/tags"]/>
<!doctype html>
<html>

<head>
    <meta charset="UTF-8">
    <!--IE Compatibility modes-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--Mobile first-->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
    <title>Metis</title>

    <meta name="description" content="Free Admin Template Based On Twitter Bootstrap 3.x">
    <meta name="author" content="">

    <meta name="msapplication-TileColor" content="#5bc0de"/>
    <meta name="msapplication-TileImage" content="assets/img/metis-tile.png"/>

    <!-- Bootstrap -->
    <link href="//cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

    <!-- Font Awesome -->
<#--<link rel="stylesheet" href="assets/lib/font-awesome/css/font-awesome.min.css">-->
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">

    <!-- Metis core stylesheet -->
    <link rel="stylesheet" href="assets/css/main.css">

    <!-- metisMenu stylesheet -->
    <link rel="stylesheet" href="assets/lib/metismenu/metisMenu.css">

    <!-- onoffcanvas stylesheet -->
    <link rel="stylesheet" href="assets/lib/onoffcanvas/onoffcanvas.css">

    <!-- animate.css stylesheet -->
    <link rel="stylesheet" href="assets/lib/animate.css/animate.css">


    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

    <!--For Development Only. Not required -->
    <script>
        less = {
            env: "development",
            relativeUrls: false,
            rootpath: "/assets/"
        };
    </script>
    <link rel="stylesheet/less" type="text/css" href="assets/less/theme.less">
    <script src="http://cdn.bootcss.com/less.js/1.7.0/less.min.js"></script>

</head>

<body style="overflow-y:hidden;">
<div class="bg-dark dk" id="wrap" style="height:100%">
    <div id="top">
        <!-- .navbar -->
        <nav class="navbar navbar-inverse navbar-static-top">
            <div class="container-fluid">


                <!-- Brand and toggle get grouped for better mobile display -->
                <header class="navbar-header">

                    <button type="button" class="navbar-toggle" data-toggle="collapse"
                            data-target=".navbar-ex1-collapse">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a href="index.html" class="navbar-brand"><img src="assets/img/logo.png" alt=""></a>

                </header>


                <div class="topnav">
                    <div class="btn-group">
                        <a data-placement="bottom" data-original-title="Fullscreen" data-toggle="tooltip"
                           class="btn btn-default btn-sm" id="toggleFullScreen">
                            <i class="glyphicon glyphicon-fullscreen"></i>
                        </a>
                    </div>
                   <!-- <div class="btn-group">
                        <a data-placement="bottom" data-original-title="E-mail" data-toggle="tooltip"
                           class="btn btn-default btn-sm">
                            <i class="fa fa-envelope"></i>
                            <span class="label label-warning">5</span>
                        </a>
                        <a data-placement="bottom" data-original-title="Messages" href="#" data-toggle="tooltip"
                           class="btn btn-default btn-sm">
                            <i class="fa fa-comments"></i>
                            <span class="label label-danger">4</span>
                        </a>
                        <a data-toggle="modal" data-original-title="Help" data-placement="bottom"
                           class="btn btn-default btn-sm"
                           href="#helpModal">
                            <i class="fa fa-question"></i>
                        </a>
                    </div>-->
                    <div class="btn-group">
                        <a data-placement="bottom" data-original-title="Show/Hide Left" data-toggle="tooltip"
                           class="btn btn-primary btn-sm toggle-left" id="menu-toggle">
                            <i class="fa fa-bars"></i>
                        </a>
                    </div>
                    <div class="btn-group">
                        <a onclick="exit()" data-toggle="tooltip" data-original-title="Logout" data-placement="bottom"
                           class="btn btn-metis-1 btn-sm">
                            <i class="fa fa-power-off"></i>
                        </a>
                        <form action="/logout" method="post" style="display: none" id="logoutForm">
                            <input type="hidden" id="csrf"name="${_csrf.parameterName}" value="${_csrf.token}"/>
                        </form>
                    </div>

                </div>


                <div class="collapse navbar-collapse navbar-ex1-collapse">

                    <!-- .nav -->
                   <!-- <ul class="nav navbar-nav">
                        <li><a href="dashboard.html">Dashboard</a></li>
                        <li><a href="table.html">Tables</a></li>
                        <li class='dropdown '>
                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                                Form Elements <b class="caret"></b>
                            </a>
                            <ul class="dropdown-menu">
                                <li><a href="form-general.html">General</a></li>
                                <li><a href="form-validation.html">Validation</a></li>
                                <li><a href="form-wysiwyg.html">WYSIWYG</a></li>
                                <li><a href="form-wizard.html">Wizard &amp; File Upload</a></li>
                            </ul>
                        </li>
                    </ul>-->
                    <!-- /.nav -->
                </div>
            </div>
            <!-- /.container-fluid -->
        </nav>
    </div>
    <!-- /#top -->
    <div id="left" style="overflow:auto;">
        <div class="media user-media bg-dark dker">
            <div class="user-media-toggleHover">
                <span class="fa fa-user"></span>
            </div>
            <div class="user-wrapper bg-dark">
                <a class="user-link" href="">
                    <img class="media-object img-thumbnail user-img" alt="User Picture" src="assets/img/user.png">
                </a>

                <div class="media-body">
                    <h5 class="media-heading">欢迎: <@security.authentication property="principal.username" /></h5>
                    <ul class="list-unstyled user-info">
                        <li><a href=""></a></li>
                        <li>上次登录时间 : <br>
                            <small><i class="fa fa-calendar"></i>&nbsp;${logLogin.signTime?datetime}&nbsp; </small>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <!-- #menu -->
        <ul id="menu" class="bg-blue dker" >
            <li class="nav-header">菜单</li>
        </ul>

        <!-- /#menu -->
    </div>
    <!-- /#left -->
    <div id="content" style="height: 100%;">
        <#if (isAgent = 0) >

            <iframe id="iframe" style="border:0; width:100%;height: 100%; background-color:#FFF;" name="iframe"
                    frameborder="0"
                    src="home.html"></iframe>

            <#else>
                <iframe id="iframe" style="border:0; width:100%;height: 100%; background-color:#FFF;" name="iframe"
                        frameborder="0"
                        src="agenthome.html"></iframe>
        </#if>






        <!-- /.inner -->
        <!-- /.outer -->
    </div>
    <!-- /#content -->
    <!-- /#right -->
</div>
<!-- /#wrap -->
<footer class="Footer bg-dark dker" style="z-index: 999999;">
    <p>2017 &copy; 南京叁壹玖科技发展有限责任公司</p>
</footer>
<!-- /#footer -->
<!-- /.modal -->
<!-- /#helpModal -->
<!--jQuery -->
<script src="assets/lib/jquery/jquery.js"></script>
<!--Bootstrap -->
<script src="assets/lib/bootstrap/js/bootstrap.js"></script>

<script src="assets/js/sidebar-menu.js"></script>
<!-- MetisMenu -->
<script src="assets/lib/metismenu/metisMenu.js"></script>
<!-- onoffcanvas -->
<script src="assets/lib/onoffcanvas/onoffcanvas.js"></script>
<!-- Screenfull -->
<script src="assets/lib/screenfull/screenfull.js"></script>


<!-- Metis core scripts -->
<script src="assets/js/core.js"></script>
<!-- Metis demo scripts -->
<script src="assets/js/app.js"></script>
<script src="/assets/lib/layer/layer.js"></script>

</body>
<script type="text/javascript">
	//每隔10分钟刷新
	setInterval("getNewMenu()", 600000);
	
    //在菜单标记最新申请数
    function getNewMenu(){
    	$.ajax({
            type: "GET",
            dataType: "json",
            url: "homeCount",
            beforeSend: function () {
            },
            success: function (res) {
                var storeNum = 0;
                var withdrawNum = 0;
            	var title = $("li.active a").data("title"); //当前页名称
            	
    			$("li .num").css('display', 'none');//隐藏所有申请数

            	if (res.data.storeApply > 0 && '店铺申请' != title) {
            		$("#menu [data-title='店铺申请'] .num").text(res.data.storeApply);
            		$("#menu [data-title='店铺申请'] .num").css('display', 'inline-block');
            		storeNum += res.data.storeApply;
            	}
            	
            	if (res.data.storeChange > 0 && '店铺信息变更申请' != title) {
            		$("#menu [data-title='店铺信息变更申请'] .num").text(res.data.storeChange);
            		$("#menu [data-title='店铺信息变更申请'] .num").css('display', 'inline-block');
            		storeNum += res.data.storeChange;
            	}
            	
                if (storeNum > 0) {
            		$("#menu [data-title='店铺管理'] .num").text(storeNum);
            		$("#menu [data-title='店铺管理'] .num").css('display', 'inline-block');
                }
                
            	if (res.data.withdraw > 0 && '提现管理' != title) {
            		$("#menu [data-title='提现管理'] .num").text(res.data.withdraw);
            		$("#menu [data-title='提现管理'] .num").css('display', 'inline-block');
            		withdrawNum += res.data.withdraw;
            	}
            	
            	if (res.data.agentWithdraw > 0 && '代理商提现申请' != title) {
            		$("#menu [data-title='代理商提现申请'] .num").text(res.data.agentWithdraw);
            		$("#menu [data-title='代理商提现申请'] .num").css('display', 'inline-block');
            		withdrawNum += res.data.agentWithdraw;
            	}
                
                if (withdrawNum > 0) {
            		$("#menu [data-title='财务管理'] .num").text(withdrawNum);
            		$("#menu [data-title='财务管理'] .num").css('display', 'inline-block');
                }
            },
            error: function (xhr, errorType, error) {
                console.log(error);
            },
            complete: function () {
            }
        });
	}	
	
    $(document).ready(function () {
        $(document).on('click', '.iframeUrl', function () {
            console.log("go to iframe");
            var cid = $(this).attr("data-url");
            var cname = $(this).attr("data-title");
            var p = $(this).closest("li").attr("data-p");
            var level = $(this).attr("data-level");
            var pid = $(this).attr("data-pid");
            var id = $(this).attr("data-id");
            $("#menu li.active").each(function (index, obj) {
                $(obj).removeClass("active");
            });
            $("#menu ul.collapse.in").each(function (index, obj) {
                if ($(obj).attr("id") != ("d" + pid))
                    $(obj).removeClass("in");
            });
            $(this).closest("li").addClass("active");
            if (p != 1) {
                $("#iframe").attr("src", cid).ready();
            }
            
            //隐藏当前选中项的动态申请数，变更类别下的总申请数
            if (pid != 0) {
            	$("li.active .num").css('display', 'none');
            	if (Number($("li.active .num").text()) > 0) {
            		var itemNum = Number($("li [data-id=" + pid + "] .num").text()) - Number($("li.active .num").text());
            		//类别下总申请数为空则隐藏
            		if (itemNum > 0) {
            			$("li [data-id=" + pid + "] .num").text(itemNum);
            		} else {
            			$("li [data-id=" + pid + "] .num").css('display', 'none');
            		}
            	}
            }
        });
        
        $.ajax({
            type: "GET",
            dataType: "json",
            url: "getMenus",
            beforeSend: function () {
            },
            success: function (res) {
                console.log(res);
                $('#menu').sidebarMenu({
                    data: res.data
                });
            },
            error: function (xhr, errorType, error) {
                console.log(error);
                alert("操作失败");
            },
            complete: function () {
            }
        });

        $("body").height($(window).height() - $(".Footer").height());
        $("#left").height($(window).height() - $(".Footer").height());
        $("#menu").height($(window).height() - $(".Footer").height());
        if (!isSupportSticky()) {
            $("#left").css("position", "relative");
        }
        
    	getNewMenu();
    });
    function isSupportSticky() {//判断是否支持sticky
        var prefixTestList = ['', '-webkit-'];
        var stickyText = '';
        for (var i = 0; i < prefixTestList.length; i++) {
            stickyText += 'position:' + prefixTestList[i] + 'sticky;';
        }
        // 创建一个dom来检查
        var div = document.createElement('div');
        div.style.cssText = stickyText;
        document.body.appendChild(div);
        var isSupport = /sticky/i.test(window.getComputedStyle(div).position);
        document.body.removeChild(div);
        div = null;
        return isSupport;
    }
    function exit() {
        layer.confirm('是否确定退出系统？', {
                    btn: ['是', '否'],//按钮
                    icon: 2,
                },
                function () {
                    $("#logoutForm").submit();
                });
    }

</script>
</html>
